@extends('nimo/domains/acc/layouts/w2ui')

@section('styles.more')
<style>
input.tdate {border:1px solid silver;width:70px;}
</style>
@stop

@section('content.breadcrumb.inner')
<li><a href="{{ route('home') }}"><i class="icon-home"></i> Dashboard</a><span class="divider"><i class="icon-angle-right"></i></span></li>
<li class="active">新規</li>
@stop

@section('content.main')
  <form action="{{ route('acc.book.entry.store')}}" method="post">
    {{ Form::token() }}
    <div id="toolbar" style="padding: 4px; border: 1px solid silver; border-radius: 3px"></div>
  </form>
  <div style="position: relative; height: 400px;">
    <div id="gridM" style="position: absolute; left: 0px; width: 75%; height: 400px;"></div>
    <div id="gridS" style="position: absolute; right: 0px; width: 24.9%; height: 400px;"></div>
  </div>
@stop

@section('javascripts.more')
<script type="text/javascript">
//var books = { { json_encode($book)} };
var balance = {books:null, editable:false};
$(function () {
  var ac =  {
    toolbar: {
      name: 'toolbar',
      items: [
        { type: 'button', id: 'moveleft', caption: '', icon: 'fa fa-arrow-left' },
        { type: 'html',  id: 'dateS', 'html':'<input style="width:70px" name="dateS" value="'+moment().startOf('month').format('YYYY-MM-DD')+'">'},
        { type: 'button',  id: 'dateB',  caption: '-'},
        { type: 'button',  id: 'dateE',  caption: moment().endOf('month').format('YYYY-MM-DD') },
        { type: 'button', id: 'moveright', caption: '', icon: 'fa fa-arrow-right' },
        { type: 'break',  id: 'break0' },
        { type: 'check',  id: 'layout', caption: 'Layout', icon: 'fa fa-check', checked: true },
        { type: 'spacer' },
        { type: 'html',  id: 'item6',html: '<input type="submit" value="APPLY" class="btn btn-primary">'},
      ]
    },
    gridM: {
      name: 'gridM',
      header: 'Book',
      show: { 
        toolbar: true,
        header: true,
        expandColumn    : false,
        toolbarAdd      : true,
        toolbarEdit     : true,
        toolbarDelete   : true,
        toolbarSave     : true,
        footer          : true,
        selectColumn    : true,
        multiSelect     : true,
      },
      keyboard : true,
      columnGroups:[
          { span: 1, caption: '#', master: true },
          { span: 1, caption: 'date', master: true },
          { span: 4, caption: 'Credit' },
          { span: 4, caption: 'Debt' },
          { span: 1, caption: 'Summary', master: true }
      ],
      columns: [
          { field: 'seq', caption: '#', size: '24px', sortable: true, resizable: true },
          { field: 'ymd', caption: 'date', size: '70px', sortable: true, resizable: true, editable: { type: 'text' }},
          
          //{ field: 'd_section', caption: 'sect', size: '45px', sortable: true, resizable: true, editable: { type: 'text' }},
          //{ field: 'd_section_name', caption: 'sect', size: '100px', sortable: true, resizable: true, editable: { type: 'text' }},
          { field: 'd_code', caption: 'code', size: '45px', sortable: true, resizable: true, editable: balance.editable},
          { field: 'd_name', caption: 'name', size: '100px', sortable: true, resizable: true, editable: { type: 'text' }},
          { field: 'd_amount', caption: 'amount', size: '80px', sortable: true, resizable: true, editable: { type: 'int' },render: 'int'},
          { field: 'd_tax', caption: '税', size: '40px', sortable: true, resizable: true, editable: { type: 'int' },render: function (rec, i, c){return render_tax(rec,i,c,rec.d_tax,rec.data.d_tax_calc_kbn);}},
          
          //{ field: 'd_tax_pct_kbn', caption: 'pkbn', size: '10px', sortable: true, resizable: true, editable: { type: 'int' },render: 'int'},

          //{ field: 'c_section', caption: 'sect', size: '45px', sortable: true, resizable: true, editable: { type: 'text' }},
          //{ field: 'c_section_name', caption: 'sect', size: '100px', sortable: true, resizable: true, editable: { type: 'text' }},
          { field: 'c_code', caption: 'code', size: '45px', sortable: true, resizable: true, editable: codeEdit},
          { field: 'c_name', caption: 'name', size: '100px', sortable: true, resizable: true, editable: { type: 'text' }},
          { field: 'c_amount', caption: 'amount', size: '80px', sortable: true, resizable: true, editable: { type: 'int' },render: 'int'},
          { field: 'c_tax', caption: '税', size: '40px', sortable: true, resizable: true, editable: { type: 'int' },render: function (rec, i, c){return render_tax(rec,i,c,rec.c_tax,rec.data.c_tax_calc_kbn);}},
          
          //{ field: 'c_tax_pct_kbn', caption: 'pkbn', size: '10px', sortable: true, resizable: true, editable: { type: 'int' },render: 'int'},

          { field: 'summary', caption: 'summary', size: '200px', sortable: true, resizable: true, editable: { type: 'text' }},
          
      ],
      onAdd: function (event) {
        w2ui['gridS'].add({recid:_recid++});
      },
      onDelete: function (event) {
          var indexes = this.last.selection.indexes;
          $.each(indexes, function(i, e) {
              if (e%2==0) {e++;} else {e--;};
              if (indexes.indexOf(e)==-1) {
                  indexes.push(e);
              }
          });
      },
      onSelect: function (event) {
          //event.onComplete = function () {selectToggle(this, event.recid, true);}
          //selectToggle(this, event.recid, true);
      },
      onUnselect: function (event) {
          //event.onComplete = function () {selectToggle(this, event.recid, false);}
          //selectToggle(this, event.recid, false);
      },
      onResize: function(event) {
          event.onComplete = function () {$(this.box).find('input.w2ui-grid-select-check:odd(:visible)').hide();}
      },
      onClick: function (event) {
        w2ui['gridS'].clear();
        var record = this.get(event.recid);
        w2ui['gridS'].add([
          { recid: 0, name: 'ID:', value: record.recid },
          { recid: 1, name: 'First Name:', value: record.fname },
          { recid: 2, name: 'Last Name:', value: record.lname },
          { recid: 3, name: 'Email:', value: record.email },
          { recid: 4, name: 'Date:', value: record.sdate }
        ]);
      },
      dummy:null
    },
    gridS: {
      name: 'gridS',
      header: 'Detail',
      show: { 
        toolbar: true,
        header: true,
        expandColumn    : false,
        toolbarAdd      : true,
        toolbarEdit     : true,
        toolbarDelete   : true,
        toolbarSave     : true,
        footer          : true,
        selectColumn    : true,
        multiSelect     : true,
      },
      keyboard : true,
      columns: [
        { field: 'list', caption: 'BC', size: '30px', sortable: true, resizable: true, editable: { type: 'list', items: ['C','B','-'], showAll: true }},
        { field: 'name', caption: 'name', size: '100px', sortable: true, resizable: true, editable: { type: 'text' }},
        { field: 'amount', caption: 'amount', size: '80px', sortable: true, resizable: true, editable: { type: 'int' },render: 'int'},
        { field: 'tax', caption: '税', size: '40px', sortable: true, resizable: true, editable: { type: 'int' }},
        { field: 'memo', caption: 'memo', size: '100px', sortable: true, resizable: true, editable: { type: 'text' }},
      ],
      onAdd: function (event) {
        w2ui['gridS'].add({recid:_recid++});
      },
      onDelete: function (event) {
          var indexes = this.last.selection.indexes;
          $.each(indexes, function(i, e) {
              if (e%2==0) {e++;} else {e--;};
              if (indexes.indexOf(e)==-1) {
                  indexes.push(e);
              }
          });
      },
      onSelect: function (event) {
          //event.onComplete = function () {selectToggle(this, event.recid, true);}
          //selectToggle(this, event.recid, true);
      },
      onUnselect: function (event) {
          //event.onComplete = function () {selectToggle(this, event.recid, false);}
          //selectToggle(this, event.recid, false);
      },
      onResize: function(event) {
          event.onComplete = function () {$(this.box).find('input.w2ui-grid-select-check:odd(:visible)').hide();}
      },
      dummy:null
    },
    
  };
  w2utils.settings.date_format='yyyy-mm-dd';
  $('#toolbar').w2toolbar($.extend({}, ac.toolbar, {}));
  $('input[name=dateS]').w2field('date', {}).on('change', function (event) {});
  $('#gridM').w2grid($.extend({}, ac.gridM, {records: balance.records}));
  $('#gridS').w2grid($.extend({}, ac.gridS, {}));



    var tax_kbn_list = {"1":"仕カ","2":"課売","3":"税外","4":"清算","5":"非売","6":"免売"};   // 税区分
    var tax_calc_kbn_list = {"1":"(","2":"+","3":"-"};   // 税計算区分
    var tax_calc_kbn_list2= {"1":"内税","2":"外税","3":"別記"};   // 税計算区分
    var records=[];
    var _recid = 0;
    var _acc={name:'grid',l2:'_l2'};
    function createSubLine1(id, e) {
        return { recid:''+id,ymd:e.ymd,d_code:e.d_code,d_name:e.d_name,d_amount:e.d_amount,d_tax:e.d_tax_pct,c_code:e.c_code,c_name:e.c_name, c_amount:e.c_amount,c_tax:e.c_tax_pct,summary:e.summary,data:e};
    };
    function createSubLine2(id, e) {
        return {recid:id+_acc.l2,d_code:e.d_code2,d_name:e.d_name2,d_amount:e.d_amount_tax,d_tax:e.d_tax_kbn,c_code:e.c_code2,c_name:e.c_name2,c_amount:e.c_amount_tax,c_tax:e.c_tax_kbn,summary:e.memo,data:e};
    };
    function getid(recid,index) {
        recid = (''+recid).replace(new RegExp(_acc.l2+'$'), '');
        return (index==0) ? 'grid_'+ _acc.name +'_rec_'+ w2utils.escapeId(recid):'grid_'+ _acc.name +'_rec_'+ w2utils.escapeId(recid+_acc.l2);
    };
    function selectToggle(grid, recid, on) {
        var index = grid.get(recid, true);
        var id = null;
        switch(index%2) {
            case 0:index++;id=getid(recid,1);break;
            case 1:index--;id=getid(recid,0);break;
            default:return;
        }
        var sel = grid.last.selection;
        var i = sel.indexes.indexOf(index);
        if (on && i == -1) {
             sel.indexes.push(index);
             var e  = $('#'+id);
             e.addClass('w2ui-selected').data('selected', 'yes').find('.w2ui-col-number').addClass('w2ui-row-selected');
             e.find('input.w2ui-grid-select-check').prop('checked', true);
        } else if (!on && i!= -1) {
            sel.indexes.splice[sel.indexes.indexOf(index),1];
            var e  = $('#'+id);
            e.removeClass('w2ui-selected').removeData('selected').find('.w2ui-col-number').removeClass('w2ui-row-selected');
            e.find('input.w2ui-grid-select-check').prop('checked', false);
        }
    };
    if (balance.books) {
      books.forEach(function(e){records.push(createSubLine1(_recid, e),createSubLine2(_recid++, e));});
    }
    function render_tax(rec, i, c, tax, calckbn) {
        if (!tax) { return ''};
        if (i%2==0) { 
            $s = (tax_calc_kbn_list[calckbn]) ? tax_calc_kbn_list[calckbn] : '';
            return $s +tax+'%'
        } else {
            return (tax_kbn_list[tax]) ? tax_kbn_list[tax] : '';
        }
    };
    
    var codeEdit= {
        type: 'list',
        url : '{{route('acc.master.code.search')}}',
        onRequest : function (event) {
            event.postData.q=event.postData.search;
        },
        onLoad : function (event) {
            if ($.isArray(event.data)) {
                var list = [];
                for (var m = 0; m < event.data.length; m++) {
                    list[m]={ id: event.data[m].code, text: event.data[m].name, data : event.data[m] };
                }
                event.data = {status:'success', items : list};
            }
            event.onComplete = function (event) {};
        },
        renderItem: function (item) {
        console.log(2);
            return item.id + ' ' + item.text;
        },
        renderDrop: function (item) {
            return item.id  + ':' + item.text;
        },
        compare: function (item, search) {
          return search.indexOf(item.id)==0;
        }
    };
});

</script>

@stop
